doc-exports/docs/obs/umn/en-us_topic_0066036542.html

<a name="en-us_topic_0066036542"></a><a name="en-us_topic_0066036542"></a>

<h1 class="topictitle1">Configuring CORS</h1>
<div id="body1499753333227"><p id="en-us_topic_0066036542__p55351642">This section describes how to use CORS in HTML5 to implement cross-origin access.</p>
<div class="section" id="en-us_topic_0066036542__section48948668114148"><h4 class="sectiontitle">Prerequisites</h4><p id="en-us_topic_0066036542__p5419211114148">Static website hosting has been configured. For details, see <a href="en-us_topic_0045853755.html">Configuring Static Website Hosting</a>.</p>
</div>
<div class="section" id="en-us_topic_0066036542__section54298028"><h4 class="sectiontitle">Procedure</h4><ol id="en-us_topic_0066036542__ol23319874"><li id="en-us_topic_0066036542__li99821455306"><span>In the bucket list, click the bucket you want to operate. The <strong id="en-us_topic_0066036542__obs_03_0307_b144421021120">Overview</strong> page is displayed.</span></li><li id="en-us_topic_0066036542__li18830181855820"><span>In the <strong id="en-us_topic_0066036542__b2562175252319">Basic Configurations</strong> area, click <strong id="en-us_topic_0066036542__b6556172482718">CORS Rules</strong>. The <strong id="en-us_topic_0066036542__b763811488279">CORS Rules</strong> page is displayed.</span><p><p id="en-us_topic_0066036542__p471425117139">Alternatively, you can choose <strong id="en-us_topic_0066036542__b1898818329375">Basic Configurations</strong> &gt; <strong id="en-us_topic_0066036542__b18988132103714">CORS Rules</strong> in the navigation pane.</p>
</p></li><li id="en-us_topic_0066036542__li45993918325"><span>Click <strong id="en-us_topic_0066036542__b15332124463218">Create</strong>. The <strong id="en-us_topic_0066036542__b08802053113218">Create CORS Rule</strong> dialog box is displayed. See <a href="#en-us_topic_0066036542__fig2425430173411">Figure 1</a> for details.</span><p><div class="note" id="en-us_topic_0066036542__note714561653618"><img src="public_sys-resources/note_3.0-en-us.png"><span class="notetitle"> </span><div class="notebody"><p id="en-us_topic_0066036542__p61451516193620">A bucket can have a maximum of 100 CORS rules configured.</p>
</div></div>
<div class="fignone" id="en-us_topic_0066036542__fig2425430173411"><a name="en-us_topic_0066036542__fig2425430173411"></a><a name="fig2425430173411"></a><span class="figcap"><b>Figure 1 </b>Creating a CORS rule</span><br><span><img id="en-us_topic_0066036542__image154545112510" src="en-us_image_0145420855.png" title="Click to enlarge" class="imgResize"></span></div>
<p id="en-us_topic_0066036542__p2815144651110"></p>
</p></li><li id="en-us_topic_0066036542__li46415294"><span>In the <strong id="en-us_topic_0066036542__b12988626155516">CORS Rule</strong> dialog box, configure <strong id="en-us_topic_0066036542__b64234838">Allowed Origin</strong>, <strong id="en-us_topic_0066036542__b41242632">Allowed Method</strong>, <strong id="en-us_topic_0066036542__b35639369">Allowed Header</strong>, <strong id="en-us_topic_0066036542__b52318866">Exposed Header</strong>, and <strong id="en-us_topic_0066036542__b1107748">Cache Duration (s)</strong>.</span><p>
<div class="tablenoborder"><table cellpadding="4" cellspacing="0" summary="" id="en-us_topic_0066036542__obs_console_0010_mmccppss_tab01" frame="border" border="1" rules="all"><caption><b>Table 1 </b>Parameters in CORS rules</caption><thead align="left"><tr id="en-us_topic_0066036542__row14261328"><th align="left" class="cellrowborder" valign="top" width="32%" id="mcps1.3.3.2.4.2.1.2.3.1.1"><p id="en-us_topic_0066036542__p14316908">Parameter</p>
</th>
<th align="left" class="cellrowborder" valign="top" width="68%" id="mcps1.3.3.2.4.2.1.2.3.1.2"><p id="en-us_topic_0066036542__p18818860">Description</p>
</th>
</tr>
</thead>
<tbody><tr id="en-us_topic_0066036542__row47932664"><td class="cellrowborder" valign="top" width="32%" headers="mcps1.3.3.2.4.2.1.2.3.1.1 "><p id="en-us_topic_0066036542__p57340601">Allowed Origin</p>
</td>
<td class="cellrowborder" valign="top" width="68%" headers="mcps1.3.3.2.4.2.1.2.3.1.2 "><p id="en-us_topic_0066036542__p43172637202016">Mandatory</p>
<p id="en-us_topic_0066036542__p14077143">Specifies the origins from which requests can access the bucket.</p>
<p id="en-us_topic_0066036542__p59585428">Multiple matching rules are allowed. One rule occupies one line, and allows one wildcard character (<strong id="en-us_topic_0066036542__b562579815151012">*</strong>) at most. An example is given as follows:</p>
<pre class="screen" id="en-us_topic_0066036542__screen5755676013302">http://rds.example.com
https://*.vbs.example.com</pre>
</td>
</tr>
<tr id="en-us_topic_0066036542__row18342472"><td class="cellrowborder" valign="top" width="32%" headers="mcps1.3.3.2.4.2.1.2.3.1.1 "><p id="en-us_topic_0066036542__p9345259">Allowed Method</p>
</td>
<td class="cellrowborder" valign="top" width="68%" headers="mcps1.3.3.2.4.2.1.2.3.1.2 "><p id="en-us_topic_0066036542__p18768523">Mandatory</p>
<p id="en-us_topic_0066036542__p63231021153331">Specifies the allowed request methods for buckets and objects.</p>
<p id="en-us_topic_0066036542__p59725833153419">The methods include Get, Post, Put, Delete, and Head.</p>
</td>
</tr>
<tr id="en-us_topic_0066036542__row34698981"><td class="cellrowborder" valign="top" width="32%" headers="mcps1.3.3.2.4.2.1.2.3.1.1 "><p id="en-us_topic_0066036542__p59154058">Allowed Header</p>
</td>
<td class="cellrowborder" valign="top" width="68%" headers="mcps1.3.3.2.4.2.1.2.3.1.2 "><p id="en-us_topic_0066036542__p6976477153727">Optional</p>
<p id="en-us_topic_0066036542__p58393322153740">Specifies the allowed headers in cross-origin requests.</p>
<p id="en-us_topic_0066036542__p2773754710645">Only CORS requests matching the allowed headers are valid.</p>
<p id="en-us_topic_0066036542__p5132822810315">You can enter multiple allowed headers (one per line) and each line can contain one wildcard character (*) at most. Spaces and special characters including <strong id="en-us_topic_0066036542__b648117133820">&amp;:&lt;</strong> are not allowed.</p>
</td>
</tr>
<tr id="en-us_topic_0066036542__row19218446"><td class="cellrowborder" valign="top" width="32%" headers="mcps1.3.3.2.4.2.1.2.3.1.1 "><p id="en-us_topic_0066036542__p13190333">Exposed Header</p>
</td>
<td class="cellrowborder" valign="top" width="68%" headers="mcps1.3.3.2.4.2.1.2.3.1.2 "><p id="en-us_topic_0066036542__p32426730153840">Optional</p>
<p id="en-us_topic_0066036542__p309847910721">Specifies the exposed headers in CORS responses, providing additional information for clients.</p>
<p id="en-us_topic_0066036542__p27193935815">By default, a browser can access only headers <strong id="en-us_topic_0066036542__b1748822114214">Content-Length</strong> and <strong id="en-us_topic_0066036542__b649832315426">Content-Type</strong>. If the browser wants to access other headers, you need to configure them in this parameter. </p>
<p id="en-us_topic_0066036542__p162724431079">You can enter multiple exposed headers (one per line). Spaces and special characters including <strong id="en-us_topic_0066036542__b5125223280">*&amp;:&lt;</strong> are not allowed.</p>
</td>
</tr>
<tr id="en-us_topic_0066036542__row38454973"><td class="cellrowborder" valign="top" width="32%" headers="mcps1.3.3.2.4.2.1.2.3.1.1 "><p id="en-us_topic_0066036542__p27845085">Cache Duration (s)</p>
</td>
<td class="cellrowborder" valign="top" width="68%" headers="mcps1.3.3.2.4.2.1.2.3.1.2 "><p id="en-us_topic_0066036542__p5186476154032">Mandatory</p>
<p id="en-us_topic_0066036542__p40859422">Specifies the duration that your browser can cache CORS responses, expressed in seconds. The default value is <strong id="en-us_topic_0066036542__b1843720126201758">100</strong>.</p>
</td>
</tr>
</tbody>
</table>
</div>
</p></li><li id="en-us_topic_0066036542__li32190482"><span>Click <strong id="en-us_topic_0066036542__b51291972">OK</strong>.</span><p><p id="en-us_topic_0066036542__p21278887">Message "The CORS rule created successfully." is displayed. The CORS configuration will take effect within two minutes.</p>
<p id="en-us_topic_0066036542__p64360423151542">Then, only the addresses specified in <strong id="en-us_topic_0066036542__b842352706154222">Allowed Origin</strong> can access the OBS bucket over the methods specified in <strong id="en-us_topic_0066036542__b842352706154237">Allowed Method</strong>. Suppose you need to configure a CORS rule for bucket <strong id="en-us_topic_0066036542__b1258516194017">testbucket</strong> and you set <strong id="en-us_topic_0066036542__b13858175233218">Allowed Origin</strong> to <strong id="en-us_topic_0066036542__b391719711339">https://www.example.com</strong>, <strong id="en-us_topic_0066036542__b11563153323317">Allowed Method</strong> to <strong id="en-us_topic_0066036542__b1354193613310">GET</strong>, <strong id="en-us_topic_0066036542__b15112555103513">Allowed Header</strong> and <strong id="en-us_topic_0066036542__b14594845363">Exposed Header</strong> both to <strong id="en-us_topic_0066036542__b3142101412362">*</strong>, and <strong id="en-us_topic_0066036542__b16726113063712">Cache Duration (s)</strong> to <strong id="en-us_topic_0066036542__b74533113715">100</strong>. Then, only GET requests from <strong id="en-us_topic_0066036542__b184801140113914">https://www.example.com</strong> are allowed to access bucket <strong id="en-us_topic_0066036542__b1830216468394">testbucket</strong>. In addition, there are no limits put on headers in the requests, and the client where the requests are from can cache the CORS response for 100 seconds.</p>
</p></li></ol>
</div>
</div>
<div>
<div class="familylinks">
<div class="parentlink"><strong>Parent topic:</strong> <a href="obs_03_0339.html">Cross-Origin Resource Sharing</a></div>
</div>
</div>


<script language="JavaScript">
<!--
image_size('.imgResize');
var msg_imageMax = "view original image";
var msg_imageClose = "close";
//--></script>