5.16 实习记录

273 阅读4分钟

安恒实习

公司项目

本机访问项目页面失败

原因:权限开关关闭,导致无法访问到后端接口。 debug过程:先在检查中查看了xhr的数据交换情况,发现返回状态码为200,说明成功请求但无数据返回。查看权限开关后发现被设置为false,修改后能成功访问了。

数据库里存储的等级、类别为integer类型,而返回的数据需要是字符串。

借助枚举类,将从数据库得到的int类型数据转换成对应的字符串返回。

与前端对接

前端将最新的接口名称和api给后端,后端根据代码中的内容统一参数名称,最后在本地运行检查是否达到需求要求。

关于mxr

XHR简介

XMLHttpRequest 对象提供了对 HTTP 协议的完全的访问,包括做出 POST 和 HEAD 请求以及普通的 GET 请求的能力。XMLHttpRequest 可以同步或异步地返回 Web 服务器的响应,并且能够以文本或者一个 DOM 文档的形式返回内容。XHR接口强制要求每个请求都具备严格的HTTP语义–应用提供数据和URL,浏览器格式化请求并管理每个连接的完整生命周期,所以XHR仅仅允许应用自定义一些HTTP首部,但更多的首部是不能自己设定的,如:

  • Accept-Charset, Accept-Encoding, Access-Control-*
  • Host, Upgrade, Connection, Referer, Origin
  • Cookie, Sec-, Proxy-, 及其他首部 浏览器会拒绝绝对不安全的首部重写,以保证应用不能假扮用户代理、用户或请求来源,如Origin由浏览器自动设置,Access-Control-Allow-Origin由服务器设置,如果接受该请求,不包含该字段即可,浏览器发出的请求将作废。

CORS请求会省略cookie和HTTP认证等用户凭据;

  • 客户端被限制只能发送“简单的跨域请求”,包括只能使用GET POSD
  • HEAD三种方式,只能访问通过XHR发送并读取的HTTP首部。
  • 如果想要启用cookie和HTTP认证,客户端必须在发送请求时通过XHR对象发送额外的属性(withCredentials),而服务器也需要以Access-Control-Allow-Credentials响应,表示允许应用发送隐私数据。同样,如果客户需要写入或读取自定义HTTP标头或想要使用“非简单的方法”的请求,那么它必须首先通过发出一个预备请求,以获取第三方服务器的许可,如下所示:

// Preflight request OPTIONS /resource.js HTTP/1.1 Host: thirdparty.com Origin: example.com Access-Control-Request-Method: POST Access-Control-Request-Headers: My-Custom-Header ...

// Preflight response HTTP/1.1 200 OK Access-Control-Allow-Origin: example.com Access-Control-Allow-Methods: GET, POST, PUT Access-Control-Allow-Headers: My-Custom-Header ...

(actual HTTP request) W3C CORS规范定义的什么时候必须使用预备请求,“简单”的请求可以跳过它,但也有各种各样场景需要使用预备请求,这就添加一次往返网络延迟。可喜的是,一旦预备请求完成,它可以由客户端缓存,以避免在后续请求进行相同的验证。 在XHR中,可以通过responseType-设置改变响应类型,如下所示:

  • “” 字符串(默认值)
  • “arraybuffer” ArrayBuffer
  • “blob” Blob
  • “document” Document
  • “json” JavaScript 对象,解析自服务器传递回来的JSON 字符串。
  • “text” 字符串

数据传输

  • 数据请求 下面是通过XHR获取一张图片,并显示到网页上的示例:

var xhr = new XMLHttpRequest();

xhr.addEventListener("progress", updateProgress, false); xhr.addEventListener("load", transferComplete, false); xhr.addEventListener("error", transferFailed, false); xhr.addEventListener("abort", transferCanceled, false);

xhr.open('GET', '/images/photo.webp'); xhr.responseType = 'blob'; xhr.onload = function() { if (this.status == 200) { var img = document.createElement('img'); img.src = window.URL.createObjectURL(this.response); img.onload = function() { window.URL.revokeObjectURL(this.src); } document.body.appendChild(img); } };

xhr.send();

  • 数据上传 上传相关事件在 XMLHttpRequest.upload 对象上被触发,像下面这样,向服务器发送一个formdata格式数据:

var formData = new FormData(); formData.append('id', 123456); formData.append('topic', 'performance');

var xhr = new XMLHttpRequest();

xhr.upload.addEventListener("progress", updateProgress); xhr.upload.addEventListener("load", transferComplete); xhr.upload.addEventListener("error", transferFailed); xhr.upload.addEventListener("abort", transferCanceled);

xhr.open('POST', '/upload'); xhr.onload = function() { ... }; xhr.send(formData);

  • 数据分片上传 var blob = ...;

const BYTES_PER_CHUNK = 1024 * 1024; const SIZE = blob.size;

var start = 0; var end = BYTES_PER_CHUNK;

while(start < SIZE) { var xhr = new XMLHttpRequest(); xhr.open('POST', '/upload'); xhr.onload = function() { ... };

xhr.setRequestHeader('Content-Range', start+'-'+end+'/'+SIZE); xhr.send(blob.slice(start, end));

start = end; end = start + BYTES_PER_CHUNK; }

每日一题

  • 搜索旋转排序数组 假设按照升序排序的数组在预先未知的某个点上进行了旋转。

( 例如,数组 [0,1,2,4,5,6,7] 可能变为 [4,5,6,7,0,1,2] )。

搜索一个给定的目标值,如果数组中存在这个目标值,则返回它的索引,否则返回 -1 。

你可以假设数组中不存在重复的元素。

你的算法时间复杂度必须是 O(log n) 级别。

思路

先用二分法找出最小值,也是那个分割点,例如 [4,5,6,7,0,1,2],我们找出数字 0; 接下来判断 target 是在分割点的左边还是右边; 最后再使用一次二分法找出 target 的位置. 所以时间复杂度为:O(logn) 如何找寻出分割点呢? 和他右边的端点比较

算法

lass Solution {
    public int search(int[] nums, int target) {
        if (nums == null || nums.length == 0) return -1;
        int left = 0;
        int right = nums.length - 1;
        while (left < right) {
            int mid = left + (right - left) / 2;
            if (nums[mid] > nums[right]) left = mid + 1;
            else right = mid;
        }
        //System.out.println(left);
        int split_t = left;
        left = 0;
        right = nums.length - 1;
        if (nums[split_t] <= target && target <= nums[right]) left = split_t;
        else right = split_t;
        while (left <= right) {
            int mid = left + (right - left) / 2;
            if (nums[mid] == target) return mid;
            else if (nums[mid] > target) right = mid - 1;
            else left = mid + 1;
        }
        return -1;
        
    }
}