質問編集履歴

2

見出しを追加

2019/09/29 14:22

投稿

t_k_
t_k_

スコア8

test CHANGED
File without changes
test CHANGED
@@ -164,7 +164,7 @@
164
164
 
165
165
  ```
166
166
 
167
-
167
+ ## 修正後
168
168
 
169
169
  コメントをいただき、下記のように変更しましたが、別途エラーが出てしまいました。
170
170
 

1

別のエラーを追加

2019/09/29 14:22

投稿

t_k_
t_k_

スコア8

test CHANGED
File without changes
test CHANGED
@@ -163,3 +163,147 @@
163
163
  })
164
164
 
165
165
  ```
166
+
167
+
168
+
169
+ コメントをいただき、下記のように変更しましたが、別途エラーが出てしまいました。
170
+
171
+
172
+
173
+ ```html
174
+
175
+ <div id='app'>
176
+
177
+ <p>テキスト:<br>
178
+
179
+ <textarea name="comment" cols="40" rows="8" v-model="data.sentence"></textarea>
180
+
181
+ </p>
182
+
183
+ <button v-on:click="sendAPI">
184
+
185
+ send
186
+
187
+ </button>
188
+
189
+ </div>
190
+
191
+ <script src="https://cdn.jsdelivr.net/npm/vue@2.5.6/dist/vue.js"></script>
192
+
193
+ <script src="https://cdn.jsdelivr.net/npm/axios@0.18.0/dist/axios.min.js"></script>
194
+
195
+ <script src="js/main.js"></script>
196
+
197
+ ```
198
+
199
+
200
+
201
+ ```javascript
202
+
203
+ var app = new Vue({
204
+
205
+ el: '#app',
206
+
207
+ data: {
208
+
209
+ data: {
210
+
211
+ apikey: 'XXXXXXXXXXXXXXXXXXXXXXX',
212
+
213
+ sentence: ''
214
+
215
+ }
216
+
217
+ },
218
+
219
+ methods: {
220
+
221
+ sendAPI: function(){
222
+
223
+ axios.post('https://api.a3rt.recruit-tech.co.jp/proofreading/v2/typo/', this.data)
224
+
225
+ .then(function(response) {
226
+
227
+ console.log(response.data)
228
+
229
+ })
230
+
231
+ .catch(function(error) {
232
+
233
+ console.log(error)
234
+
235
+ })
236
+
237
+ }
238
+
239
+ }
240
+
241
+ })
242
+
243
+ ```
244
+
245
+ コンソールでのエラーは下記。
246
+
247
+
248
+
249
+ ```
250
+
251
+ Access to XMLHttpRequest at 'https://api.a3rt.recruit-tech.co.jp/proofreading/v2/typo/' from origin 'null' has been blocked by CORS policy: Response to preflight request doesn't pass access control check: No 'Access-Control-Allow-Origin' header is present on the requested resource.
252
+
253
+ main.js:16 Error: Network Error
254
+
255
+ ```
256
+
257
+ 検索結果を参考に見よう見まねで下記のように書き換えても同じエラーでした。
258
+
259
+
260
+
261
+ ```javascript
262
+
263
+ var app = new Vue({
264
+
265
+ el: '#app',
266
+
267
+ data: {
268
+
269
+ data: {
270
+
271
+ apikey: 'XXXXXXXXXXXXXXXXXXXXXXX',
272
+
273
+ sentence: ''
274
+
275
+ },
276
+
277
+ headers: {
278
+
279
+ "Access-Control-Allow-Origin": "*"
280
+
281
+ }
282
+
283
+ },
284
+
285
+ methods: {
286
+
287
+ sendAPI: function(){
288
+
289
+ axios.post('https://api.a3rt.recruit-tech.co.jp/proofreading/v2/typo/', this.data, this.headers)
290
+
291
+ .then(function(response) {
292
+
293
+ console.log(response.data)
294
+
295
+ })
296
+
297
+ .catch(function(error) {
298
+
299
+ console.log(error)
300
+
301
+ })
302
+
303
+ }
304
+
305
+ }
306
+
307
+ })
308
+
309
+ ```