D17 第八周 前端基础串 API

这礼拜的课程进度:

• FE102 中场休息到结束

FE102 後半段笔记摘要

介绍网页储存资料的方式

• cookie
• localStorage
• sessionStorage

这边只是纯粹介绍，还没开始应用

网页跟服务器沟通的方式

• form 表单
  在 ajax 出现之前只有这个方法
• ajax XMLHttpRequest
  Web 2.0 变革很重要的推手之一，从此改变的网页的生态
• JSONP
  这是为了跳脱 CORS 问题的一种解法。算蛮有趣的技术，但课程没有着墨太多，有兴趣的人可以自己研究。

同源政策、跨域存取

这些问题我觉得蛮难讲清楚的，就是 API 呼叫的时候浏览器会很龟毛地要你符合某一种规范。
但是在正常的情况下，按照 API 规格书上要求的格式去呼叫，通常就不会有问题了。

以一种不求甚解的角度来说，确实不需要理会太多，因为那是後端在烦恼的事情。

如果你求知欲很强或是想走後端的话，那这边就会需要蛮注意的。
但是说真的，到目前我除了写过 header('Access-Control-Allow-Origin: *'); 以外，我还真的没有写过什麽特别的设定。

可能要开发更安全的 API 时，後端才会需要用到更多的设定吧。但我目前学到这边大概就这样，给其他人参考。

作业

分别是串抽奖 API 和图奇 API

一开始写作业最常遇到的问题之一：浏览器跳 CORS 警告。通常这是因为 header 没有带上对应的参数。然後还要跟 DOM 的元素操作一起，一开始可能会手忙脚乱，就慢慢习惯这样。另外目前的 API 呼叫是用 XMLHttpRequest，还没有用 jQuery 的 $.ajax()，然後 callback 也还没有用 promise 包起来，所以还蛮痛苦的，要等到後面才会学到新的写法。

切板是另一个蛮花时间的部分，但说真的，这过程中可以体会到很多漂亮的网页都是花蛮多心思才写得出来。也许是胃口被养大了，所以看到自己烂烂的版面就会觉得很羞耻，但这也是前端的必经之路吧。