[Client JS] traceSDKInternal may not working、fetch.ts should handle exception、exitspan's url tag may be an empty stirng

[Lighfer]

Please answer these questions before submitting your issue.

• Why do you submit this issue?
• Question or discussion
• Bug
• Requirement
• Feature or performance improvement

---

Bug

traceSDKInternal may not working

The hasTrace variable in the fetch.ts and xhr.ts may have wrong value, for example:

ClientMonitor.register({
  collector: 'http://IP/skywalking',
  traceSDKInternal: false
  ...
})

the collector's pathname is /skywalking, so the segments report request will send to http://IP/skywalking/v3/segments, and it's pathname is /skywalking/v3/segments, so the result of following code will be false:

([ReportTypes.ERROR, ReportTypes.ERRORS, ReportTypes.PERF, ReportTypes.SEGMENTS] as string[]).includes(
  url.pathname,
)

fetch.ts should handle exception

// fetch.ts
const response = await origFetch(...args); // should wrap with try catch to ensure that the error log and segment  can be collected

---

Requirement or improvement

When the request send failed, The exitSpan's url tag in the fetch.ts and xhr.ts may be an empty string, such as the cors error. So i think it can be replaced with the request's url when the responseURL is empty.

// xhr.ts or fetch.ts
const exitSpan: SpanFields = {
  ...
  tags: options.detailMode
    ? [
        ...
        {
          key: 'url',
          value: segCollector[i].event.responseURL // may be an empty string
          // maybe replae wih: segCollector[i].event.responseURL || `${url.protocol}//${url.host}${url.pathname}`
        },
      ]
};

[wu-sheng]

Would you send a pull request to fix?