本指南將說明第三方應用程式開發人員如何使用 MerchantSupport 服務，為商家建立應用程式內診斷頁面。
您可以使用這項服務建立與 Merchant Center 帳戶診斷和產品問題頁面類似的 UI。
MerchantSupport 服務僅適用於第三方 UI，要求應在商家與應用程式的 UI 互動時觸發。如要自動進行商家帳戶的診斷，請參閱帳戶狀態、產品狀態和產品篩選指南。
建議您在應用程式中提供下列頁面，協助商家排解問題：
- 帳戶診斷
- 產品診斷
導入診斷頁面的不同選項
您可透過多種方式導入診斷頁面，請視需求選擇相關選項，決定複雜診斷動作的處理方式。在要求中，您可以將 user_input_action_option 設為下列其中一個選項：
REDIRECT_TO_MERCHANT_CENTER：此為預設選項。需要顯示額外內容或接收商家額外輸入內容的動作，並未完全在應用程式中實作。對這類動作來說，API 會提供連結，讓您重新導向至 Merchant Center 中的對應頁面，供商家執行相關動作。BUILT_IN_USER_INPUT_ACTIONS：您可以實作複雜的動作，需要使用者在應用程式中輸入內容，做為應用程式內解決方案。
實作診斷頁面
本節說明如何導入「診斷」頁面。這項工具使用預設 (簡單) 選項，處理重新導向至 Merchant Center 的複雜動作。
如果想進一步瞭解應用程式內動作的進階實作方式，請參閱下列各節，以及「利用使用者輸入內容實作內建動作」。
導入作業
我們建議的診斷頁面看起來大致如下：
- 商家會在您的應用程式中開啟診斷頁面。
應用程式會呼叫
MerchantSupport服務，要求進行診斷。以下是要求範例：
POST https://shoppingcontent.googleapis.com/content/v2.1/{merchantId}/merchantsupport/renderaccountissues?timeZone=America/Los_Angeles&languageCode=en-GB {}將 {merchantId} 替換成您要觸發動作處理作業的帳戶專屬 ID。
您的應用程式會顯示來自商家回應的診斷和建議動作。回應範例如下：
{ "issues": [ { "title": "Misrepresentation", "impact": { "message": "Prevents all products from showing in all countries", "severity": "ERROR", "breakdowns": [ { "regions": [ { "code": "001", "name": "All countries" } ], "details": [ "Products not showing organically" ] } ] }, "prerenderedContent": "\u003cdiv class=\"issue-detail\"\u003e\u003cdiv class=\"issue-content\"\u003e\u003cp class=\"content-element\"\u003e\u003cspan class=\"segment\"\u003eBased on the information available about your business, there is reason to believe that customers are being misled on Google. Review the Misrepresentation policy and make changes to your Merchant Center and/or online store.u003c/span\u003e\u003c/p\u003e\u003cp class=\"content-element root-causes-intro\"\u003e\u003cspan class=\"segment\"\u003eMake sure your Merchant Center and online store follow the following best practices / guidelines\u003c/span\u003e\u003c/p\u003e\u003cul class=\"content-element root-causes\"\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eProvide transparency about your business identity, business model, policies and how your customers can interact with you\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003ePromote your online reputation by showing reviews or highlighting any badges or seals of approval\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eUse a professional design for your online store that includes an SSL certificate\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eMake sure it's accessible for all users without any redirects and doesn't have any placeholders for text and images.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eProvide information in the business information settings in your Merchant Center\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eLink any relevant third-party platforms to your Merchant Center and create a Google Business Profile.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eFollow SEO guidelines, improve your eligibility for seller ratings and match your product data in your Merchant Center with your online store\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003c/ul\u003e\u003ca href=\"https://support.google.com/merchants/answer/6150127?hl=en-US\" class=\"content-element\"\u003eLearn more about the Misrepresentation policy\u003c/a\u003e\u003c/div\u003e\u003c/div\u003e", "actions": [ { "externalAction": { "type": "REVIEW_ACCOUNT_ISSUE_IN_MERCHANT_CENTER", "uri": "https://merchants.google.com/mc/products/diagnostics/accountissues?a=672911686&hl=en-US" }, "buttonLabel": "Request review", "isAvailable": true } ] }, { "title": "Adult-oriented content", "impact": { "message": "Prevents all products from showing in all countries", "severity": "ERROR", "breakdowns": [ { "regions": [ { "code": "001", "name": "All countries" } ], "details": [ "Products not showing organically" ] } ] }, "prerenderedContent": "\u003cdiv class=\"issue-detail\"\u003e\u003cdiv class=\"callout-banners\"\u003e\u003cdiv class=\"callout-banner callout-banner-info\"\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eReview requested on Aug 9, 2023. It can take a few days to complete.u003c/span\u003e\u003c/p\u003e\u003c/div\u003e\u003c/div\u003e\u003cdiv class=\"issue-content\"\u003e\u003cp class=\"content-element\"\u003e\u003cspan class=\"segment\"\u003eThere was a problem identified with the sale of prohibited adult products on your online store. In the case that you are intentionally selling adult items, enable Adult content in Settings in your Merchant Center. In your product file, use the \u003c/span\u003e\u003cspan class=\"segment segment-attribute\"\u003eadult\u003c/span\u003e\u003cspan class=\"segment\"\u003e attribute for specific products.u003c/span\u003e\u003c/p\u003e\u003cp class=\"content-element root-causes-intro\"\u003e\u003cspan class=\"segment\"\u003eMake sure the products meet the policy requirements\u003c/span\u003e\u003c/p\u003e\u003cul class=\"content-element root-causes\"\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eAdult oriented content may be prohibited or restricted depending on the product sold and the country it is sold\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eSee a full list of countries in the HelpCenter\u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eDon't list sexually explicit content that is intended to arouse or includes content such as text, image, audio, or video of graphic sexual acts intended to arouse\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eExamples: Graphic depictions of sexual acts in progress, including hardcore pornography, any type of genital, anal, or oral sexual activity; graphic depictions of masturbation or genital arousal and language explicitly referencing arousal, masturbation, cartoon porn, or hentai\u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003c/ul\u003e\u003ca href=\"https://support.google.com/merchants/answer/6150138?hl=en-US#wycd-restricted-adult-content\" class=\"content-element\"\u003eLearn more about the Adult-oriented content policy\u003c/a\u003e\u003c/div\u003e\u003c/div\u003e" }, { "title": "Missing return and refund policy", "impact": { "message": "Limits visibility of all products in all countries", "severity": "ERROR", "breakdowns": [ { "regions": [ { "code": "001", "name": "All countries" } ], "details": [ "Limited visibility for products showing organically" ] } ] }, "prerenderedContent": "\u003cdiv class=\"issue-detail\"\u003e\u003cdiv class=\"issue-content\"\u003e\u003cp class=\"content-element\"\u003e\u003cspan class=\"segment\"\u003eThere was a problem identified with the return and/or refund policy of your online store. Update your return or refund policy to provide customers a transparent shopping experience.u003c/span\u003e\u003c/p\u003e\u003cp class=\"content-element root-causes-intro\"\u003e\u003cspan class=\"segment\"\u003eMake sure your products meet the Shopping policy requirements\u003c/span\u003e\u003c/p\u003e\u003cul class=\"content-element root-causes\"\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eIt's available on your online store\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eWe recommend that you have a separate landing page for your policy and link to it from the other pages on your online store, so that it's easy to find.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp class=\"tooltip tooltip-style-info\"\u003e\u003cspan class=\"segment\"\u003eIt's available in the language of the country you're selling in or in English\u003c/span\u003e\u003cspan class=\"tooltip-icon\"\u003e\u003cbr\u003e\u003c/span\u003e\u003cspan class=\"tooltip-text\"\u003e\u003cspan class=\"segment\"\u003eMake sure that the return and/or refund policy is available in the target language or in English. Ideally, users should be given the option to select the return and/or refund policy in their own language.u003c/span\u003e\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003cli\u003e\u003cp\u003e\u003cspan class=\"segment\"\u003eIt's accessible to everyone visiting your online store, without having to log in, sign up or enter any personal information\u003c/span\u003e\u003c/p\u003e\u003c/li\u003e\u003c/ul\u003e\u003ca href=\"https://support.google.com/merchants/answer/9158778?hl=en-US\" class=\"content-element\"\u003eLearn more about Missing return and refund policy\u003c/a\u003e\u003c/div\u003e\u003c/div\u003e", "actions": [ { "externalAction": { "type": "REVIEW_ACCOUNT_ISSUE_IN_MERCHANT_CENTER", "uri": "https://merchants.google.com/mc/products/diagnostics/accountissues?a=672911686&hl=en-US" }, "buttonLabel": "Request review", "isAvailable": true } ] } ], "alternateDisputeResolution": { "uri": "https://support.google.com/european-union-digital-services-act-redress-options?hl=en-US", "label": "Additional options available to you" } }建議您按照傳回順序顯示問題，並使用
title和impact.message。此外，如果商家將滑鼠遊標懸停在問題名稱或說明上，建議您顯示問題的impact.breakdowns。商家點選清單中的問題。
應用程式會根據
country、destination、prerendered_content及每個問題，顯示商家可採取的actions相關詳細impact。動作分為以下不同類型：- 外部動作：指向外部頁面，例如在 Merchant Center 中協助商家解決問題。
- 內建簡易動作：將滑鼠遊標指向應用程式中商家可解決問題的頁面。
- 內建使用者輸入動作：開啟對話方塊，商家可在其中提供必要資訊並要求動作。這種動作只有在要求
BUILT_IN_USER_INPUT_ACTIONS時才能使用。
商家按照指示解決問題。
商家會重新載入應用程式中的診斷頁面。
應用程式向
MerchantSupport服務提交另一個要求，並顯示更新的問題清單。
您可以將完成的應用程式顯示的資訊與 Merchant Center 的診斷頁面進行比較，以驗證實作成果。
UI 模擬
以下範例說明如何在帳戶診斷頁面中，顯示 renderaccountissues 回應中的資訊。UI 中的物件會對應至模擬中對應的 API 欄位。您可以針對產品問題建立類似的頁面。
以下是填入帳戶診斷頁面的外觀：
設定預先算繪 HTML 的樣式
呼叫 MerchantSupport 服務的回應會包含 prerendered_content 欄位，也就是 HTML 中每個問題的詳細資料。您可以直接將此 HTML 內容嵌入 UI，以可讀取的格式顯示問題。
您可能會看到具有 new-element 類別的 HTML 元素。new-element 類別會套用至您整合 MerchantSupport 服務後新增至 HTML 的元素。建議您使用 new-element 類別隱藏元素，以便在應用程式中向使用者顯示這些元素之前，先設定其樣式。
以下是 prerendered_content 欄位值的範例：
<div class="issue-detail">
<div class="callout-banners">
<div class="callout-banner callout-banner-info"><p><span class="segment">Review requested on Aug 9, 2023. It can take a few days to complete.</span>
</p></div>
</div>
<div class="issue-content"><p class="content-element"><span class="segment">There was a problem identified with the sale of prohibited adult products on your online store. In the case that you are intentionally selling adult items, enable Adult content in Settings in your Merchant Center. In your product file, use the </span><span
class="segment segment-attribute">adult</span><span class="segment"> attribute for specific products.</span>
</p>
<p class="content-element root-causes-intro"><span class="segment">Make sure the products meet the policy requirements</span>
</p>
<ul class="content-element root-causes">
<li><p class="tooltip tooltip-style-info"><span class="segment">Adult oriented content may be prohibited or restricted depending on the product sold and the country it is sold</span><span
class="tooltip-icon"><br></span><span class="tooltip-text"><span class="segment">See a full list of countries in the HelpCenter</span></span>
</p></li>
<li><p class="tooltip tooltip-style-info"><span class="segment">Don't list sexually explicit content that is intended to arouse or includes content such as text, image, audio, or video of graphic sexual acts intended to arouse</span><span
class="tooltip-icon"><br></span><span class="tooltip-text"><span class="segment">Examples: Graphic depictions of sexual acts in progress, including hardcore pornography, any type of genital, anal, or oral sexual activity; graphic depictions of masturbation or genital arousal and language explicitly referencing arousal, masturbation, cartoon porn, or hentai</span></span>
</p></li>
</ul>
<a href="https://support.google.com/merchants/answer/6150138?hl=en-US#wycd-restricted-adult-content"
class="content-element">Learn more about the Adult-oriented content policy</a></div>
</div>
如果您在應用程式中嵌入了上述 HTML prerendered_content，但未套用任何樣式，看起來會像這樣：
您可以運用多個 CSS 類別來調整內容在 UI 中的呈現方式。可用的 CSS 範例如下：
issue-detail {
text-align: left;
width: 700px;
border-radius: 8px;
background: white;
margin: 16px;
padding: 16px;
}
.content-element {
margin: 8px 0 8px 0;
display: block;
}
/* callout banners */
.callout-banners {
margin: 0 0 16px 0;
}
.callout-banner {
display: block;
padding: 16px 16px 6px 16px;
margin: 0 0 8px 0;
border-radius: 8px;
}
.callout-banner-info {
background: #e8f0fe;
}
.callout-banner-warning {
background: #fef7e0;
}
.callout-banner-error {
background: #fce8e6;
}
/* add an icon to the callout banner */
.callout-banner p {
background-repeat: no-repeat;
padding-left: 32px;
}
.callout-banner-error p {
background-image: url("https://fonts.gstatic.com/s/i/short-term/release/googlesymbols/error/default/20px.svg");
}
.callout-banner-warning p {
background-image: url("https://fonts.gstatic.com/s/i/short-term/release/googlesymbols/warning/default/20px.svg");
}
.callout-banner-info p {
background-image: url("https://fonts.gstatic.com/s/i/short-term/release/googlesymbols/search/default/20px.svg");
}
/* segments with style */
.segment-attribute {
color: #198639;
font-family: monospace, monospace;
}
.segment-bold {
font-weight: bold;
}
.segment-italic {
font-style: italic;
}
/* tooltip */
.tooltip {
position: relative;
}
.tooltip-style-info .tooltip-icon:before {
content: '(i)';
font-style: normal;
font-weight: normal;
text-decoration: inherit;
margin-left: 5px;
}
.tooltip-style-question .tooltip-icon:before {
content: '(?)';
font-style: normal;
font-weight: normal;
text-decoration: inherit;
margin-left: 5px;
}
.tooltip .tooltip-text {
visibility: hidden;
text-align: left;
background: white;
border-radius: 8px;
padding: 5px 0;
border: 1px solid;
padding: 10px;
box-shadow: 3px 7px 12px #c1c1c1;
position: absolute;
z-index: 1;
}
.tooltip:hover .tooltip-text {
visibility: visible;
}
/* table */
table.content-element {
margin: 16px 0 16px 0;
border: 1px solid #ccc;
border-collapse: collapse;
margin: 1em 0;
}
table.content-element th {
background-color: #eee;
}
table.content-element th, table td {
border: 1px solid #ddd;
font-size: 0.9em;
padding: 0.3em 1em;
}
/* hidde elements added in future, until they are supported in your application */
.new-element {
visibility: hidden;
}
如果您使用上述 CSS，轉譯內容看起來會像這樣：
您也可以使用 CSS 設定及顯示工具提示：
根據使用者輸入內容實作內建動作
透過使用者輸入內容的內建動作，您可以在應用程式中提供複雜的診斷功能，做為應用程式內解決方案。建議以對話方塊的形式實作，讓商家能夠提供輸入內容、讀取其他資訊，並確認要求。
每個動作都包含一或多個動作流程。某些動作可以有多個流程。舉例來說，當商家要求額外審查時，由於他們不同意決策，解決問題的流程也可能不同，因此結果可能不同。
如要要求資料以透過使用者輸入內容實作複雜動作，您必須將 user_input_action_option 欄位設為 BUILT_IN_USER_INPUT_ACTIONS 值。
POST https://shoppingcontent.googleapis.com/content/v2.1/{merchantId}/merchantsupport/renderaccountissues
{
"user_input_action_option": "BUILT_IN_USER_INPUT_ACTIONS"
}
將 {merchantId} 替換成您要觸發動作處理作業的帳戶專屬 ID。
導入作業
我們建議的診斷頁面顯示要求使用者輸入內容的流程建議流程如下：
商家按一下動作按鈕。
- 如果有多個資料流可供使用，您的應用程式會提供所有流程，以便商家根據其意圖選擇一種流程。
- 商家選取流程。
您的應用程式會顯示所選動作流程的標題、訊息、摘要和使用者輸入表單。我們建議您在對話方塊中顯示這些詳細資料。
- 如果有摘要，即包含重要資訊，旨在協助商家進一步瞭解動作的運作方式，以及如何成功執行。建議您醒目顯示這則訊息，並根據呼叫的嚴重性設定樣式。
- 如果資料流中有任何輸入欄位，必須顯示這些欄位，商家才能提供值。如果輸入欄位標示為 required，則應用程式不應在提供值之前，讓商家傳送要求。
商家讀取資訊並提供要求的值。
商家按一下按鈕即可確認要求。
應用程式會呼叫
MerchantSupport服務，觸發該動作的處理程序。以下是要求範例：POST https://shoppingcontent.googleapis.com/content/v2.1/{merchantId}/merchantsupport/triggeraction { actionContext: "ActionContextValue=", actionInput: { actionFlowId: "flow1", inputValues: [ { input_field_id: "input1", checkbox_input_value: { value: true } } ] }將 {merchantId} 替換成您要觸發動作處理作業的帳戶專屬 ID。
如要存取
BuiltInUserInputAction的triggeraction方法，請使用這份表單提交要求。您的應用程式會顯示來自
MerchantSupport服務傳回的確認訊息。- 如果服務傳回具有
INVALID_ARGUMENT狀態的驗證錯誤，就會包含應向商家顯示的詳細資訊和本地化錯誤訊息。建議您在受影響的輸入欄位附近顯示這類錯誤。以下是回應範例
{ "error": { "code": 400, "message": "[actionInput.inputValues] Invalid user input", "status": "INVALID_ARGUMENT", "details": [ { "@type": "type.googleapis.com/google.rpc.ErrorInfo", "reason": "invalid", "domain": "global" }, { "@type": "type.googleapis.com/google.rpc.BadRequest", "fieldViolations": [ { "field": "actionInput.inputValues.input", "description": "The field is required" } ] } ] } }- 如果服務傳回無效的狀態或內部錯誤 (以
FAILED_PRECONDITION和INTERNAL狀態表示)，應用程式應指示商家重新載入頁面或稍後再試。
- 如果服務傳回具有