►
From YouTube: PnP Webcast - Azure AD implicit flow with SPFx client-side web part with developer preview
Description
PnP Webcast around client-side web parts and Azure AD implicit flow for calling AAD secured services. More details around the webcast is available from http://dev.office.com/blogs/azure-ad-implicit-flow-with-spfx-client-side-web-parts
A
Welcome
everybody:
this
is
ship
on
Patterson
practices,
webcast
also
known
as
office
365
patterns
and
practices
webcast,
and
this
time
we
kind
of
talked
about
Usher
ad
implicit
flow
usage
within
the
SharePoint
framework
client-side
web
part
during
the
Developer
Preview.
That
is
a
mouthful.
We
absolutely
understand
that,
but
what
we
want
to
do
with
this
webcast.
This
is
essentially
telling
you.
A
B
A
Again,
you'll
be
responsible
of
the
javascript
demo,
but
before
we
go
to
the
actual
content
and
walk
through
what
does
the
hardest?
Russia
ad
implicit
flow
behaves
right
now
with
the
Developer
Preview,
a
pointer
framework
client-side
web
points,
just
a
quick
note
on
a
sharepoint
patterns
and
practices,
so
shipment
patterns
and
practices,
it's
an
open
source
community,
driven
initiative,
owned
and
coordinated
by
ship
and
engineering.
So
what
we
do
is
that
we
provide
code
samples
from
a
stepping
stone
samples
to
more
much
more
complex
samples,
reusable
components,
guidance
document,
ations
monthly
community
calls
case
studies.
A
The
themes
are
on
SharePoint
framework,
Shepherd,
adding
and
remote
API
usage
against
on-premises
sharepoint
and
also
against
office
365
in
general.
But
let's
concentrate
on
today's
topic.
So
let's
talk
about
ahsha,
ad
implicit
flow
considerations
in
the
context
context
of
SharePoint
framework-
and
this
really
applies
on
the
developer
preview
of
the
of
the
client-side
web
part,
because
we
want
to
make
sure
that
if
you
are
implementing
your
demos
or
playing
around
with
client-side
web
parts,
you
are
aware
of
the
current
situation.
So
you
don't
hang
your
head
against
the
wall
for
nothing.
That's
really!
A
Let's
say
one
to
one,
and
that
means
that
whenever
you
need
to
access,
let's
say
a
WebP,
a
p.I
is
the
curt
with
inertia
ad
using
the
radio
that
authorization
you
will
need
to
have
a
separate
as
signing
or
separate
looking,
and
we
do
absolutely
understand
that.
That's
not
optimal
and
we're
looking
into
changing
that
in
the
future.
But
it's
good
to
be
aware
of
this
limitation
right
now.
A
So
in
practice,
if
you
do
have
a
prep
and
let's
say
an
operation
or
functionality
which
needs
to
call
and
with
API
inertia
or
sign
in
against
the
match
of
craft,
you
need
to
do
a
separate
as
sign
in
and
really
with
the
developer
preview.
This
is
slightly
complicated.
You
need
to
do
actually
separate
sign
in
/,
eat
wit
part.
A
The
the
implicit
flow
does
not
work
with
an
Internet
Explorer,
so
it
does
work
properly
with
chrome
and
firefox
and
H,
but
Internet
Explorer
10
doesn't
work
at
all
and
with
with
other
IE
in
process,
there
might
be
chances
with
IAS
zones.
The
secretary
the
zones,
depending
on
your
settings
and
and
one
thing
one
additional
thing
kind
of
to
be
aware
of
this
one
so
because
we're
using
a
client-side
implementation,
so
the
javascript
is
actually
authorized
a
or
authenticating
against
a
co-ed
when
it
get
to
access
token.
A
The
access
token
is
within
the
context
of
the
page
and
technically
it
means
that
the
access
token
is
available
technically
a
for
other
web
parts
in
the
page
to
take
advantage
as
well.
So
if
you
would
be
using
this
kind
of
a
setup
in
the
actually
within
the
production
which
currently
isn't
even
possible
because
we're
in
deaf
preview,
they
could
be
any
kind
of
a
security
challenge
around
this
one.
So
that's
not
really
an
optimal
situation
either.
Anything
you
want
to
add
on
that.
On
the
on
the
points
waldeck.
B
So
especially,
there
is
one
new
ends
with
the
relation
to
that.
The
whole
flow
doesn't
work
in
18,
I
ie10,
and
that
has
to
do
with
the
fact
that
there
is
an
an
error
in
the
LGA's
love
library
that
we
currently
use
in
the
samples
that
we
have.
There
is
a
bug
that
prevents
that
library
to
work
in
ie10.
So
in
theory,
if
you
would
implement
the
whole
flow
by
yourself,
which
isn't
trivial,
you
might
get
it
to
work,
yes,
I
toe.
A
And
that's
really
an
IE
internet
explorer
specific
setting
because
it
has
the
security
zones,
functionality
which
it
has
been
kind
of
a
painful
thing
for
the
web
stack
developers.
So
that's
a
classic
classics
challenge
between
the
configurations,
but
really
what
we
want
to
also
kind
of
make
sure
that
you
understand
that
these
aren't
elimination
right
now
in
the
Developer
Preview,
when
this
Web
cast
has
been
recorded,
whenever
we
can't
go
closer
and
closer
to
the
ga,
which
is
the
global
availability
of
the
client-side
web
parts,
there
will
be
improvements
in.
A
Client-Side
wait
points
or
within
the
context
of
SharePoint
framework,
and
our
absolute
intention
is
that
you
are
able
to
access.
The
Russia
abs
occurred
assets
within
the
client-side
web
parts
in
a
security
a
and
you
are
able
to
expose
that
information,
because
when
you
think
of
it
as
an
example,
the
information
in
a
Microsoft
craft
is
extremely
valuable
and
it
takes
there's
a
lot
of
lot
of
interesting
contact,
contextual
information
which
we
would
like
to
get
access
on
within
the
client-side
web
parts.
Like
even
simple
examples.
A
My
upcoming
my
upcoming
meetings
or
my
colleagues
or
the
people
search
on
and
so
on.
All
of
those
are
extremely
valuable
scenarios
and
we
are
looking
into
addressing
this
now
really
mentioned
few
times
already.
We
just
want
to
make
sure
that
you
are
aware
of
the
situation
right
now
in
the
developer
preview
and
we'll
update
this
update
the
guidance,
the
SharePoint
client-side
web
part
guidance
based
on
the
changes,
what
we
release
as
part
of
the
upcoming
jobs,
couch
mutt.
A
So
there's
some
challenges,
we're
going
to
address
them,
but
let's
have
a
look
on
this
one
in
practice.
So
let's
have
a
conceptual.
Let's
have
a
look
on
this
conceptual
sample
which
is
showing
the
behavior
right
now.
So,
if
you're
using
a
Dolce
us
in
the
react
based
component,
if
I
remember
correctly,
I've
run
what
is
actually
the
flow
when
you're
authenticating
against
our
ad.
B
Right
in
this
demo,
we
would
like
to
show
you
a
sample
sharepoint,
framer,
client-side
web
part
connected
to
Microsoft
graph.
That
shows
you
an
overview
of
your
upcoming
appointments.
So,
let's
add
the
web
part
to
the
page
and
then,
as
we
already
said,
the
first
thing
that
you
have
to
do
is
you
have
to
sign
in
with
your
organ
to
the
AAT
right,
because
currently,
though,
we
are
work
wench
now,
even
though,
if
you
would
be
on
your
internet
that
still
uses
different
of
cortical
than
the
Microsoft
graph
right.
B
So
first
thing
that
said
that
we
have
to
do
is
we
have
to
sign
in
with
our
org
account?
So
let's
do
that,
and
here
we
get
pop
up.
That's
asking
us
to
actually
sign
in
with
our
account.
So
let's
get
the
account
info
from
our
sex,
a
cure,
store
and
sign-in
pop
up
is
gone,
and
now
we
load
info
from
the
microphotographs,
so
the
sign-in
completed,
and
now
we
can
see
the
overview
of
upcoming
appointments
for
today
that
we
got
from
the
Microsoft
graph.
So
with
that,
let's
have
a
look:
how
how
this
works.
B
So
if
we
go
to
the
code,
the
first
thing
that
you
should
keep
in
mind
that
there
is
the
80
GS
library
built
by
by
Microsoft
that
simplifies
implementing
the
alt
implicit
flow
in
client
sites
of
solutions
and
that
library
has
been
out
there
for
a
while
and
when
you
want
to
use
that
in
SharePoint
framework
client-side
web
parts.
It
works
exactly
the
same
as
in
the
past.
So
even
though
Microsoft
looks
now
in
trying
to
get
the
whole
experience
easier.
B
If
you
work,
if
you
work
with
a
with
80
GS
and
the
micrograph
in
graphic
in
the
past,
you
can
work
exactly
the
same
way
with
the
micrograph
and
SharePoint
framework
client-side
high
parts.
So,
similarly
to
what
you've
done
in
the
past,
there
is
the
config
that
actually
did
escribes
hour
apart
and
ties
that
into
an
appt
registered
with
a
ad.
So
here
you
see
the
I
ID
of
our
app,
and
here
you
see
resources
that
we
want
to
ask
so
in.
B
In
this
case,
we
want
to
access
the
micrograph
in
the
web
part
if
we
go
down
initially
you've
seen
that
we
showed
the
bottom
that
use
can
use
to
sign
in
with
day
their
ad
account.
So
that
is
here
and
on
a
clique
which,
which
is
here,
we
call
the
sign-in
function,
which
starts
the
login
flow
using
the
80
GS
library,
and
once
that,
that's
done,
we
actually
reach
out
to
Microsoft
graph.
B
We
first
get
the
access
token
to
it,
and
once
we
have
that
we
use
the
rest
api
call
to
get
the
data
from
the
micrograph.
So
that's
it!
It's
that
simple
s
uses
exactly
the
same
approach
as
you
would
in
the
past
to
access
the
microsoft
graph
from
single
page,
apps
or
other
things
that
you
would
add
on
a
on
the
page.
So
if
you
learn
how
to
do
do
that
now
in
preview,
imagine
that
whenever
the
improvements
will
will
be
be
be
available,
it
will
will
become
even
easier
right.
A
One
thing:
a
kind
of
additional
thing
exactly
on
what
world
accent
is
that,
yes,
this
is
slightly
complex
now
and
we're
working
on
getting
it
slightly
more
optimized
in
the
future,
so
make
it
more
seamless.
But
already
today
you
can
start,
let's
say,
building
your
trashed
versions
of
the
craft.
We
are
Microsoft
craft-based
with
parts
like
into
this
case.
A
This
is
showing
the
upcoming
meetings
and
just
agree
on
the
fact
that
yes,
it's
complex
now,
but
let's
concentrate
on
a
business
logic
of
the
web
part
and
we'll
we'll
make
it
more
seamless
from
an
accessibility,
perspectival
access
perspective
on
getting
information
from
the
crap.
So
this
does
not
pluck
you
to
start
building
and
designing
your
craft
based
up
with
parts
for
the
time
being.
That's
really
the
key
point.
Yep.
A
Good
and
just
to
repeat
that,
one
more
time
we
are
looking
into
addressing
at
this
challenges
in
practice,
so
we
are
looking
into
having
much
better
usher,
80
integration
with
client-side
web
bus.
So
if
you're
running
into
this,
if
you're
planning
to
implement
something
supercool
using
Microsoft
graph
and
you're
running
into
this
issues,
we
will
address
and
make
this
thing
better
in
the
future
and
we'll
make
sure
that
we
have
a
proper
guidance
updated
around
these
limitations
or
around
the
future
capabilities.
B
Even
though
occurrences
situation
is
an
optimal
I'd
encourage
everyone
to
give
it
a
try
again
try
to
actually
think
about.
How
could
you
I'll
average,
the
micrograph
inside
the
weapons
that
you
built,
because
they
they
really
offer
you
some
great
scenarios
that
that
you
that
you
could
use
to
improve
how
people
collaborate.
A
Absolutely
absolutely
so
at
this
point
it's
it.
It
is
definitely
worthwhile
to
have
a
test
and
play
around
with
the
scenarios
play
around
with
how
to
access
the
data,
even
though
the
accessing
data
might
isn't
it
that
simple
and
optimal
right
now,
but
you
can
still
after
you're
accessing
the
data
you
can
actually
implement
the
web
part
in
the
right
way
already,
but
I
think
that's
enough
for
this
particular
topic.
So
thank
you
for
everybody
for
who's
watching
and
we'll
come
up
with
a
new
web
cast
sooner
or
later.